/**
 * Created by tdzl2003 on 6/24/16.
 */

import React, { PropTypes } from 'react';
import {
  StyleSheet,
  View,
  Image,
  Text,
} from 'react-native';
import Dialog from './Dialog';

import imgSmile from './smile.png';

const styles = StyleSheet.create({
  content: {
    padding: 20,
    alignItems: 'center',
    borderRadius: 5,
  },
  icon: {
    height: 49,
    width: 49,
    marginBottom: 15,
    resizeMode: 'contain',
  },
  title: {
    marginBottom: 5,
  },
  label: {

  },
});

const propTypes = {
  ...Dialog.propTypes,
  title: PropTypes.string,
  content: PropTypes.string,
};

export default function Confirm(props) {
  const { title, content, ...others } = props;
  return (
    <Dialog {...others}>
      <View style={styles.content}>
        <Image style={styles.icon} source={imgSmile} />
        <Text style={styles.title}>
          {title}
        </Text>
        <Text style={styles.label}>
          {content}
        </Text>
      </View>
    </Dialog>
  );
}

Confirm.propTypes = propTypes;

export function confirm(navigator, title, content, onConfirm, onCancel) {
  const ret = new Promise((resolve, reject) => {
    navigator.push({
      component: Confirm,
      sceneConfig: Dialog.sceneConfig,
      passProps: {
        title,
        content,
        onConfirm: resolve,
        onCancel: reject,
      },
      isModal: true,
    });
  }).then(onConfirm, onCancel);
  ret.catch(() => {}); // avoid warning;
  return ret;
}
